import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(
          colorScheme: const ColorScheme(
              primary: Colors.black,
              surfaceVariant: Colors.white,
              secondary: Colors.green,
              background: Colors.white, //整个页面背景色
              error: Colors.red,
              brightness: Brightness.light,
              onBackground: Colors.white,
              outlineVariant: Colors.white,
              onError: Colors.yellow,
              onPrimary: Colors.white,
              onSecondary: Colors.white,
              onSurface: Color.fromARGB(255, 233, 233, 240),
              surface: Color.fromARGB(255, 17, 0, 255)) //整个标题栏颜色
          // primarySwatch: Colors.blue, // 设置主色调,无效，怎么设都是白色
          ),
      home: Scaffold(
        appBar: AppBar(title: const Text("图标"), centerTitle: true),
        body: MyHomePage(),
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  List<Widget> _initGridViewData() {
    List<Widget> tempList = [];
    for (var i = 0; i < 12; i++) {
      tempList.add(Container(
          alignment: Alignment.center,
          decoration: const BoxDecoration(color: Colors.blue),
          child: Text("第${i + 1}个元素", style: const TextStyle(fontSize: 20))));
    }
    return tempList;
  }

  @override
  Widget build(BuildContext context) {
    return GridView.extent(
        maxCrossAxisExtent: 252, //我们通过它可以快速的创建横轴子元素为固定最大长度的GridView
        padding: const EdgeInsets.all(10),
        crossAxisSpacing: 10.0, //水平间距
        mainAxisSpacing: 5.0, //垂直间距
        childAspectRatio: 1.5, //宽高比
        children: _initGridViewData());

    // return GridView.count(
    //   padding: const EdgeInsets.all(10),
    //   crossAxisCount: 2, //一行元素个数
    //   crossAxisSpacing: 10.0, //水平间距
    //   mainAxisSpacing: 5.0, //垂直间距
    //   childAspectRatio: 1.5, //宽高比
    //   children: _initGridViewData(),
    // );

    // // return GridView.extent(
    //   //通过它可以快速的创建横轴子元素为固定最大长度的的Gridview
    //   maxCrossAxisExtent: 200.0, //配置横轴子元素最大长度，自动计算一行显示多少个元素
    //   children: const [
    //     Icon(Icons.home),
    //     Icon(Icons.pedal_bike),
    //     Icon(Icons.ac_unit),
    //     Icon(Icons.search),
    //     Icon(Icons.settings),
    //     Icon(Icons.air),
    //     Icon(Icons.airport_shuttle),
    //     Icon(Icons.baby_changing_station),
    //     Icon(Icons.cabin),
    //     Icon(Icons.cable_rounded),
    //     Icon(Icons.dangerous),
    //     Icon(Icons.e_mobiledata_sharp),
    //   ],
    // );
  }
}
